<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 视口标准化 -->
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, minimun-scale=1.0, maximun-scale=1.0, user-scale=no">
    <title>售货机2.0--统计</title>

    <!-- 引入首页样式 -->
    <link rel="stylesheet" href="./css/stati.css">

    <!-- 导入js文件 -->
    <script src="./js/stati.js"></script>
</head>

<body>
    <!-- 管理导航栏 -->
    <section class="nav">
        <!-- 管理左侧 -->
        <a class="left">统计</a>
        <!-- 管理右侧 -->
        <div class="right">|</div>
    </section>

    <!-- Tab选择栏 -->
    <section class="demo">
        <div class="total">数据总览</div>
        <div class="rank">商家统计</div>
    </section>

    <section class="main">
        <!-- 数据总览 -->
        <div class="item" id="content_1">
            <!-- 销售额数据 -->
            <div class="demo1">
                <div class="title">销售额</div>
                <div class="content">
                    <li class="li1">昨日销售额</li>
                    <li class="li2">今日销售额</li>
                    <li class="li3">累计销售额</li>
                </div>
                <div class="chart"></div>
            </div>
            <!--收益额数据 -->
            <div class="demo2">
                <div class="title">收益额</div>
                <div class="content">
                    <li class="li1">昨日收益额</li>
                    <li class="li2">今日收益额</li>
                    <li class="li3">累计收益额</li>
                </div>
                <div class="chart"></div>
            </div>
            <!--昨日数据 -->
            <div class="demo3">
                <div class="title">订单量</div>
                <div class="content">
                    <li class="li1">昨日订单量</li>
                    <li class="li2">今日订单量</li>
                    <li class="li3">累计订单量</li>
                </div>
                <div class="chart"></div>
            </div>
        </div>
        <!-- 酒店统计 -->
        <div class="item" id="content_2" style="display: none;">
            <!-- 总数据展示栏 -->
            <div class="demo1">
                <div class="title">商家排行数据</div>
                <div class="content">
                    <li class="li1">昨日</li>
                    <li class="li2">近7天</li>
                    <li class="li3">近30天</li>
                    <li class="li4">累计</li>
                </div>
            </div>
            <div class="demo2">
                <div class="title">收益榜</div>
                <div class="content">
                    <div class="data_1">
                        <li class="li1"></li>
                        <li class="li2">平台商家</li>
                        <li class="li3">99</li>
                    </div>
                    <div class="data_2">
                        <li class="li1"></li>
                        <li class="li2">纳雄商家</li>
                        <li class="li3">58</li>
                    </div>
                    <div class="data_3">
                        <li class="li1"></li>
                        <li class="li2">大大怪商家</li>
                        <li class="li3">31</li>
                    </div>
                </div>
            </div>
            <div class="demo3">
                <div class="title">订单榜</div>
                <div class="content">
                    <div class="data_1">
                        <li class="li1"></li>
                        <li class="li2">平台商家</li>
                        <li class="li3">32</li>
                    </div>
                    <div class="data_2">
                        <li class="li1"></li>
                        <li class="li2">大大怪商家</li>
                        <li class="li3">19</li>
                    </div>
                    <div class="data_3">
                        <li class="li1"></li>
                        <li class="li2">纳雄商家</li>
                        <li class="li3">17</li>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- 底部菜单--模块 -->
    <section class="footer">
        <!-- 首页 -->
        <a href="../../index.html"><img src="./images/管理灰.png" alt=""></a>
        <!-- 统计 -->
        <a href="#"><img src="./images/统计蓝.png" alt=""></a>
        <!-- 收益 -->
        <a href="../profit/profit.html"><img src="./images/收益灰.png" alt=""></a>
        <!-- 我的 -->
        <a href="#"><img src="./images/我的灰.png" alt=""></a>
    </section>
</body>

</html>